<script setup>
  import useHome from "@/stores/modules/home";
  import {storeToRefs} from "pinia";
  import ResourcesItemV9 from "@/components/ResourcesItem/ResourcesItemV9.vue";
  import ResourcesItemV3 from "@/components/ResourcesItem/ResourcesItemV3.vue";
  import {useRouter} from "vue-router";

  const homeStore = useHome()
  const router = useRouter()

  const {houseList} = storeToRefs(homeStore)

  const itemClick = house => {
    router.push('/detail/' + house.houseId)
  }
</script>

<template>
  <div class="homeResources">
    <h2 class="title">热门精选</h2>

    <!--首页卡片-->
    <div class="resources">
      <template v-for="item in houseList" :key="item.data.houseId">
        <resources-item-v9 v-if="item.discoveryContentType === 9"
                           :houseData="item.data" @click="itemClick(item.data)"/>
        <resources-item-v3 v-else-if="item.discoveryContentType === 3"
                           :houseData="item.data" @click="itemClick(item.data)"/>
      </template>
    </div>
  </div>
</template>

<style lang="less" scoped>
  .homeResources {
    .title {
      padding: 0 20px;
    }

    .resources {
      padding: 5px;
      display: flex;
      flex-wrap: wrap;
    }
  }
</style>